<template>
    <el-container style="height: 100%">
        <el-header style="position: fixed;z-index: 9;width: 100%">
            <h1 class="title">
                        <span style="color: #5f5b5b">
                            当前位置 ：
                        </span>
                交通调查数据入库
            </h1>
        </el-header>
        <el-main style="background: #F0F0F066;margin-top:45px">
            <el-row>
                <el-col :span="24">
                    <el-row :gutter="10">
                        <el-card>
                            <h1 style="font-size: 1.4em">已入库任务列表</h1>
                            <tl-table :table-data="tableData" :cur-page="curPage" :path="path" :history-path="historyPath"></tl-table>
                            <el-divider></el-divider>
                            <admin-page :page-size="pageSize" ref="adminPage" @updateData="updateData"
                                        :total="total" @currentChange="currentChange"/>
                        </el-card>
                    </el-row>
                </el-col>
            </el-row>
        </el-main>
    </el-container>
</template>

<script>
    import TlTable from "../../../../components/admin/table/traffic/TTlTable";
    import AdminPage from "../../../../components/admin/menu/AdminPage";
    import qs from "qs";

    export default {
        name: "DataRIU",
        components: {
            TlTable,
            AdminPage
        },
        data() {
            return {
                tableData: [],
                beginPos: '',
                curPage: 1,
                pageCount: 6,
                pageSize: 10,
                total: 0,
                state: 7,
                type: 4,
                path: 'TrafficNode',
                historyPath: 'TrafficHistory'
            }
        },
        mounted() {
            this.updateData(this.curPage, this.state);
        },
        methods: {
            currentChange(curpage) {
                this.updateData(curpage, this.state);
            },
            updateData(curPage, state) {
                this.pageSize = this.$refs.adminPage.pageSize;
                this.curPage = curPage === undefined ? this.curPage : curPage;
                this.state = state === undefined ? this.state : state;
                axios.get("/bjdzms/releaseTask/findAllByType",
                    {
                        params: {
                            'page': this.curPage,
                            'rows': this.pageSize,
                            'type': this.type,
                            'state': this.state
                        }
                    }).then(res => {
                    this.tableData = [];
                    this.tableData = res.data.rows;
                    this.beginPos = res.data.beginPos;
                    this.curPage = res.data.curPage;
                    this.pageCount = res.data.pageCount;
                    this.total = res.data.total;
                });
            },
        }
    }
</script>

<style scoped>
    .el-header {
        background: #EBEBEB;
        color: #e5e9ef;
        font-size: 2em;
        line-height: 80px;
        border: 5px solid #EBEBEB;
    }

    .el-main {
        background: #fff;
    }

    .el-container {
        height: 100%;
    }

    .el-form-item {
        width: 610px;
    }

    .title {
        font-size: 14px;
        color: #97a8be;
        font-weight: 400 !important;
    }
</style>
